<script setup lang="ts">
// import { ref, reactive, inject, onBeforeMount } from 'vue'
import { useRouter } from 'vue-router'
import {
  NButton
} from 'naive-ui'

const router = useRouter()
function backToLastPage () {
  router.go(-1)
}

</script>
<template>
  <div class="no_author">
    <div class="pic">
      <img class="img" src="../../assets/Empty.png" alt="图片加载失败,请求失败">
      <div class="info">你无权访问,点击
        <n-button text tag="a" target="_blank" type="primary" @click="backToLastPage" text-color="#fff">
          返回
        </n-button>
      </div>
    </div>
  </div>
</template>

<style lang="less" scoped>
.no_author {
  width: 100%;
  height: 100vh;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;

  .pic {
    width: 481px;
    display: flex;
    flex-direction: column;

    .info {
      color: white;
      align-items: center;
      display: flex;
      justify-content: center;
      font-size: 20px;
      text-indent: 3px;

      :deep(.n-button__content) {
        padding-left: 2px;
        color: #BC98FF;
        height: 30px;
        font-size: 20px !important;
      }
    }

    // background: url('../../assets/Empty.png') no-repeat fixed;
    img {
      width: 481px;
      height: 481px;
    }
  }
}
</style>
